import { defineStore } from 'pinia';

// tabs store 的名称，在应用中唯一，会在开发者工具中显示

/**
 * 标签页项接口定义
 */
interface ListItem {
  name: string;     // 路由名称
  path: string;     // 路由路径
  title: string;    // 标签页标题
}

/**
 * 标签页状态管理 store
 */
export const useTabsStore = defineStore('tabs', {
  // 返回初始状态的函数
  state: () => ({
    list: [] as ListItem[],  // 标签页列表
  }),
  
  // 计算属性（getters）
  getters: {
    /**
     * 判断是否显示标签页（是否有打开的标签页）
     */
    show: state => {
      return state.list.length > 0;
    },
    
    /**
     * 获取所有标签页的名称列表
     */
    nameList: state => {
      return state.list.map(item => item.name);
    },
  },
  
  // 操作方法（actions）
  actions: {
    /**
     * 删除指定索引的标签页
     * @param index - 要删除的标签页索引
     */
    delTabsItem(index: number) {
      this.list.splice(index, 1);
    },
    
    /**
     * 添加新的标签页
     * @param data - 标签页数据
     */
    setTabsItem(data: ListItem) {
      this.list.push(data);
    },
    
    /**
     * 清空所有标签页
     */
    clearTabs() {
      this.list = [];
    },
    
    /**
     * 关闭其他标签页（只保留指定的标签页）
     * @param data - 要保留的标签页数组
     */
    closeTabsOther(data: ListItem[]) {
      this.list = data;
    },
    
    /**
     * 关闭当前标签页并自动跳转到相邻标签页
     * @param data - 包含路由信息的对象
     */
    closeCurrentTag(data: any) {
      for (let i = 0; i < this.list.length; i++) {
        const item = this.list[i];

        if (item?.path === data.$route.fullPath) {
          // 如果当前标签页不是最后一个，跳转到下一个标签页
          if (i < this.list.length - 1) {
            data.$route.push(this.list[i + 1]?.path);
          } 
          // 如果当前标签页是最后一个但不是第一个，跳转到上一个标签页
          else if (i > 0) {
            data.$route.push(this.list[i - 1]?.path);
          } 
          // 如果只有一个标签页，跳转到首页
          else {
            data.$route.push('/');
          }
          
          // 从列表中移除当前标签页
          this.list.splice(i, 1);
          break;
        }
      }
    },
  },
});
